$(function () {
    // 1. 全选 全不选功能模块
    // 就是把全选按钮（checkall）的状态赋值给 三个小的按钮（j-checkbox）就可以了
    // 事件可以使用change
    $('.checkall').change(function () {
        //把小按钮 和大按钮的 checked 改为点击的全选按钮的checked
        $(".j-checkbox, .checkall").prop("checked", $(this).prop("checked"));
        if($(this).prop('checked')){
            $('.cart-item').addClass('check-cart-item')
        }else(
            $('.cart-item').removeClass('check-cart-item')
        )
    })

    // 2. 如果小复选框被选中的个数等于3 就应该把全选按钮选上，否则全选按钮不选。
    $('.j-checkbox').change(function () {
        //通过小按钮的checked的长度和小按钮的长度进行比较
        //如果全部勾选 全选按钮的checked为true ，否则false
        if ($('.j-checkbox:checked').length === $('.j-checkbox').length) {
            $('.checkall').prop('checked', true)
        } else {
            $('.checkall').prop('checked', false)
        }
        $(this).parents('.cart-item').toggleClass('check-cart-item')
    })


    // 3. 增减商品数量模块 首先声明一个变量，当我们点击+号（increment），就让这个值++，然后赋值给文本框。
    $('.increment').click(function () {
        // 得到当前兄弟文本框的值
        var n = $(this).siblings('.itxt').val()
        n++
        $(this).siblings('.itxt').val(n)

        // 当前商品的价格 p 
        var p = $(this).parent().parent().siblings('.p-price').html();
        p = p.substr(1)
        // console.log(p);
        // 小计模块 
        // toFixed(2) 可以让我们保留2位小数
        //根据文本框的值 乘以 当前商品的价格  就是 商品的小计
        var price = (p * n).toFixed(2)

        $(this).parents(".p-num").siblings(".p-sum").text("￥" + price);
        getSum()
    })
    $('.decrement').click(function () {
        // 得到当前兄弟文本框的值
        var n = $(this).siblings('.itxt').val()
        //如果itxt为1 则不能继续--
        if (n == 1) {
            return 
        }
        n--
        $(this).siblings('.itxt').val(n)

        // 当前商品的价格 p 
        var p = $(this).parent().parent().siblings('.p-price').text();
        p = p.substr(1)
        // console.log(p);
        // 小计模块 
        // toFixed(2) 可以让我们保留2位小数
        //根据文本框的值 乘以 当前商品的价格  就是 商品的小计
        var price = (p * n).toFixed(2)
        //parents返回祖先元素
        $(this).parents(".p-num").siblings(".p-sum").text("￥" + price);
        getSum()
    })

    //  4. 用户修改文本框的值 计算 小计模块 
    $('.itxt').change(function () {
        var n = $(this).val()
        n = Math.floor(n)
        if (n < 0 || isNaN(n) || !Math.floor(n)) {
            //变量改为1
            n = 1
            //文本框的值也改为1
            $(this).val(1)
        }
        $(this).val(n)


    // 当前商品的价格 p 
    var p = $(this).parents('.p-num').siblings('.p-price').html();
    p = p.substr(1)
    // console.log(p);
    // 小计模块 
    // toFixed(2) 可以让我们保留2位小数
    //根据文本框的值 乘以 当前商品的价格  就是 商品的小计
    var price = (p * n).toFixed(2)
    $(this).parents(".p-num").siblings(".p-sum").html("￥" + price);
    getSum()
    
})

function getSum() {
    var count = 0; // 计算总件数 
    var money = 0; // 计算总价钱
    //遍历每个商品的数量
    $('.itxt').each(function (i, ele) {
        //把每个商品的件数加起来给count
        count += parseInt($(ele).val())
    }) 
    //把总件数赋值给总件数
    $('.amount-sum em').text(count);

    //遍历每个商品的价钱
    $('.p-sum').each(function (i, ele) {
        //把每个商品的价钱加起来然后截取字符串取后面的数字
        money += parseFloat($(ele).text().substr(1))
    })
    money = money.toFixed(2)
    $('.price-sum em').text("￥" + money)
}
    //删除元素
    $('.p-action a').click(function(){
        $(this).parent().parent().remove()
        getSum()
    })

    $('.remove-batch').click(function(){
        $('.j-checkbox:checked').parents(".cart-item").remove();
        getSum()
    })

    $(".clear-all").click(function(){
        $('.cart-item-list').remove()
        getSum()
    })
    getSum()



})